var index = 0,
    userText = getId("userText"),//获取待匹配文本标签id
    userRegExp = getId("userRegExp"),//获取正则表达式标签id
    userModifierTag = document.getElementsByName("userModifier"),//!子标签还有其他类型标签getElementsByName找名称，获取正则表达式标签id
    matchingBtn = getId("matchingBtn"),//获取检测按钮标签id
    textbox = getId("textbox"),   //获取结果显示标签id 
    userModifierLength = userModifierTag.length;//获取单选标签个数
// 函数名：getId
// 功能：用元素id名获取id。
// 入口参数：idName
function getId(idName) {
    return typeof (idName) === "string" ? document.getElementById(idName) : idName;//idName;对参数判断，字符串类型返回获取到id,否则返回原参数。
}
// 函数名：addHandle
// 功能：封装通用事件绑定方法
// 入口参数：element绑定事件的dom元素,type事件类型名，handle事件处理函数
function addHandle(element, type, handle) {
    // Chrome浏览器
    if (element.addEventListener) {
        element.addEventListener(type, handle, false);//true,chrome支持捕获事件绑定
        // IE支持dom2级事件绑定
    } else if (element.attachEvent) {
        element.attachEvent('on' + type, handle);//!element.attachEvent需要'on' + type
        // IE只支持dom0级事件绑定
    } else {
        element['on' + type] = handle;//!type为变量，不是真实事件，不能直接element.type
    }
}
// 函数名：getUserInput
// 功能：获取待匹配文本
// 入口参数：空
function getUserInput() {
    if (!userText.value) {//！判断内容存在，提示用户输入且定位光标
        alert("请输入待匹配文本");
        userText.focus();
    }
    return userText.value;
}
// 函数名：getUserRegExp
// 功能：获取待正则表达式
// 入口参数：空
function getUserRegExp() {
    // if (!userRegExp.value) {
    //     alert("请输入正则表达式");
    //     userRegExp.focus();
    // }
    if (!userRegExp.value) {
        alert("请输入正则表达式");
        if (userText.value) {
            userRegExp.focus();
        }
    }
    return userRegExp.value;
}
// 函数名：getUserModifier
// 功能：获取待正则修饰符
// 入口参数：空
function getUserModifier() {
    var CharString = "";//先清空，再获取
    for (let i = 0; i < userModifierLength; i++) {
        // addHandle(userModifierTag[i], "click", function () {
        //     var divIndex = this.getAttribute("modifier");//!this.getAttribute,this为tag
        //     index = divIndex;
        //     // changeImg(index);
        //     console.log(index);
        // });
        if (userModifierTag[i].checked) {
            ModifierChar = userModifierTag[i].title;//！userModifierTag[i].title获取标签title属性值用来设置字符串或索引
            CharString = CharString + ModifierChar;
        }
    }
    return CharString;
}
// 函数名：matching
// 功能：获取到字符和正则表达式匹配
// 入口参数：空
function matching() {
    var getUserInputTxt = getUserInput();//待匹配文本内容
    var userRegExpStr = getUserRegExp();//正则表达式
    var userModifierChar = getUserModifier();//正则修饰符
    var pattern = new RegExp(userRegExpStr, userModifierChar);
    
    if (pattern.exec(getUserInputTxt)==""||pattern.exec(getUserInputTxt)==null) {
        return '没匹配';
    } else {
        return pattern.exec(getUserInputTxt);
    }

}
// getUserModifier();
addHandle(matchingBtn, "click", function () {
    // console.log(matching());
    textbox.value = matching();
})
